<!DOCTYPE html>
<html>
<head>
    <title>test</title>
    <script src="../bower_components/platform/platform.js"></script>
    <link rel="import" href="../api/jscut-cam.html">
    <link rel="import" href="../api/jscut-simulate-gcode.html">
</head>
<body>
    <svg width="800" height="400" preserveAspectRatio="xMinYMin meet"></svg>
    <br><textarea rows="20" cols="60"></textarea>
    <jscut-simulate-gcode cutterdiameter="3.175" cutterheight="25.4" elementsurl="../elements"></jscut-simulate-gcode>

    <script>
        document.addEventListener('polymer-ready', function () {
            var svg = document.querySelector('svg');
            var svgNS = "http://www.w3.org/2000/svg";

            function addToSvg(attrs, geometry) {
                var path = document.createElementNS(svgNS, "path");
                path.setAttribute('d', jscut.geometry.toSvgPathData(geometry, 90));
                for (var k in attrs)
                    path.setAttribute(k, attrs[k]);
                svg.appendChild(path);
                var bbox = svg.getBBox();
                svg.setAttribute("viewBox", (bbox.x - 2) + " " + (bbox.y - 2) + " " + (bbox.width + 4) + " " + (bbox.height + 4));
            }

            function addCamPathToSvg(attrs, geometry) {
                var path = document.createElementNS(svgNS, "path");
                path.setAttribute('d', jscut.cam.toSvgPathData(geometry, 90));
                for (var k in attrs)
                    path.setAttribute(k, attrs[k]);
                svg.appendChild(path);
                var bbox = svg.getBBox();
                svg.setAttribute("viewBox", (bbox.x - 2) + " " + (bbox.y - 2) + " " + (bbox.width + 4) + " " + (bbox.height + 4));
            }

            var r1 = jscut.geometry.createRect(-50, -50, 50, 50, 'mm');
            var r2 = jscut.geometry.translate(r1, 20, 20, 'mm');
            var r3 = jscut.geometry.translate(r2, 20, 20, 'mm');

            addToSvg({ fill: 'red' }, r1);
            addToSvg({ fill: 'green' }, r2);
            addToSvg({ fill: 'blue' }, r3);

            function testPreview(svgAttrs, dx, dy, operation, tool) {
                addToSvg(
                    svgAttrs,
                    jscut.geometry.translate(
                        jscut.cam.getPreviewGeometry(jscut.data.cleanOperation(operation), jscut.data.cleanTool(tool)),
                        dx, dy, "mm"));
            }

            function testCamPaths(svgAttrs, dx, dy, operation, tool) {
                for (var i = 0; i < operation.geometries.length; ++i)
                    operation.geometries[i] = jscut.geometry.translate(operation.geometries[i], dx, dy, "mm");
                addCamPathToSvg(
                    svgAttrs,
                    jscut.cam.getCamPaths(jscut.data.cleanOperation(operation), jscut.data.cleanTool(tool)));
            }

            testPreview({ fill: 'black' }, 150, 0, { geometries: [r1, r2, r3] });
            testPreview({ fill: 'black' }, 300, 0, { geometries: [r1, r2, r3], combineOp: "Intersect" });
            testPreview({ fill: 'black' }, 450, 0, { geometries: [r1, r2, r3], combineOp: "Diff" });
            testPreview({ fill: 'black' }, 600, 0, { geometries: [r1, r2, r3], combineOp: "Xor" });

            testPreview({ fill: 'black' }, 150, 150, { geometries: [r1, r2, r3], units: "mm", width: 10, camOp: "Pocket" });
            testPreview({ fill: 'black' }, 300, 150, { geometries: [r1, r2, r3], units: "mm", width: 10, camOp: "Inside" });
            testPreview({ fill: 'black' }, 450, 150, { geometries: [r1, r2, r3], units: "mm", width: 10, camOp: "Outside" });
            testPreview({ fill: 'black' }, 600, 150, { geometries: [r1, r2, r3], units: "mm", width: 10, camOp: "Engrave" });

            testCamPaths({ fill: 'none', stroke: 'cyan' }, 150, 150, { geometries: [r1, r2, r3], units: "mm", width: 10, camOp: "Pocket" });
            testCamPaths({ fill: 'none', stroke: 'cyan' }, 300, 150, { geometries: [r1, r2, r3], units: "mm", width: 10, camOp: "Inside" });
            testCamPaths({ fill: 'none', stroke: 'cyan' }, 450, 150, { geometries: [r1, r2, r3], units: "mm", width: 10, camOp: "Outside" });
            testCamPaths({ fill: 'none', stroke: 'cyan' }, 600, 150, { geometries: [r1, r2, r3], units: "mm", width: 10, camOp: "Engrave" });

            var operation = jscut.data.cleanOperation({ geometries: [r1, r2, r3], units: "mm", width: 10, cutDepth: 3.175, name: "Test Operation" });
            var tool = jscut.data.cleanTool();
            var material = jscut.data.cleanMaterial();
            var gcodeOptions = jscut.data.cleanGcodeOptions();
            var camPaths = jscut.cam.getCamPaths(operation, tool);

            var gcode = "";
            gcode += jscut.cam.getGcodeHeader(tool, material, gcodeOptions);
            gcode += jscut.cam.getOperationGcode(0, operation, tool, material, gcodeOptions, camPaths);

            document.querySelector('textarea').value = gcode;
            document.querySelector('jscut-simulate-gcode').gcode = gcode;
        });
    </script>
</body>
</html>
